import React from 'react';
import axios from 'axios';
import TableView from './table';
import Filter from './filter';

class HardwareAlarm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      tableData: [],
      total: 0,
      pageNum: 1,
      filterInfo: undefined
    };
  }

  componentDidMount() {
    this.getData();
  }

  getData = () => {
    const { filterInfo = {} } = this.state;
    const {
      type = '', level = '', status: visiable = '', detail = '' 
    } = filterInfo;
    const { pageNum } = this.state;
    axios.get(`/aiOps/alarm/${pageNum}/100?detail=${detail}&level=${level === 'all' ? '' : level}&visible=${visiable === 'all' ? '' : visiable}&type=${type === 'all' ? '' : type}`).then((res) => {
      const { data = {} } = res.data || {};
      this.setState({ 
        tableData: data.datas || [],
        total: data.totalRecord
      });
    });
  };

  filter = (filterInfo) => {
    console.log(filterInfo, 'qqqqqqqqqq');
    this.setState({
      filterInfo
    }, () => {
      console.log(filterInfo);
      this.getData();
    });
  };

  clearFilter = () => {
    this.setState({ filterInfo: undefined }, () => {
      this.getData();
    });
  };

  changePage = (num) => {
    this.setState({ pageNum: num }, () => {
      this.getData();
    });
  };

  signAllRead = () => {
    axios.post('/aiOps/alarm/markAlarmInfo').then(() => {
      this.getData();
    });
  };

  render() {
    const { tableData = [], total } = this.state;
    return (
      <>
        <Filter signAllRead={this.signAllRead} filter={this.filter} clearFilter={this.clearFilter} />
        <TableView changePage={this.changePage} refresh={this.getData} total={total} tableData={tableData} />
      </>
    );
  }
}

export default HardwareAlarm;
